<!doctype html>
<html lang="en">
<head>
    <title>
        Domino
    </title>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="stylesheet" href="static/css/bootstrap.min.css">
    <link rel="stylesheet" href="static/css/all.min.css"">
    <link href="static/css/css2.css" rel="stylesheet">
    <link href="static/css/aos.css" rel="stylesheet">
    <link href="static/css/mcss.css" rel="stylesheet">
    <script src='static/js/jquery-1.11.3.min.js'></script>

<style>
    .it1{
        width: 10rem;
        height: 10rem;
    }

    .it2{
        width: 192px;
        height: 192px;
    }
</style>
</head>
<body style="background-color: aliceblue;">
    <div  class="it1" style="background-image: url('static/picture/25.png');background-size: 100%;" ></div>
    <div id="xxx" style="height: 50px;"></div>
    <div  class="it2" style="background-image: url('static/picture/25.png');background-size: 100%;" ></div>
</body>
<script>
       var div = document.getElementById('xxx')
       var width = div.style.width || div.clientWidth || div.offsetWidth || div.scrollWidth;  
       div.innerText = width
</script>
</html>